<template>
  <div>
    <el-row type="flex">
      <el-col :span="20">
        <div class="content-one-right">
          <el-row>
            <div class="content-one-right-text">
              <h2>今日授课</h2>
            </div>
          </el-row>
          <el-row>
            <el-col :span="8">
              <div class="content-one-right-course">
                <el-row type="flex" justify="center">
                  <h2>{{year}}-{{month}}-{{day}}</h2>
                </el-row>
                <el-row type="flex" justify="center">
                  <small>暂无课程信息</small>
                </el-row>
                <el-row type="flex" justify="center">
                  <i class="fa fa-th" aria-hidden="true"></i>
                </el-row>
              </div>
            </el-col>
          </el-row>
        </div>
      </el-col>
    </el-row>
    <el-row type="flex">
      <el-col :span="20">
        <div class="content-one-right">
          <el-row>
            <div class="content-one-right-text">
              <h2>明日备课</h2>
            </div>
          </el-row>
          <el-row>
            <el-col :span="8">
              <div class="content-one-right-course">
                <el-row type="flex" justify="center">
                  <h2>{{year}}-{{month}}-{{day+1}}</h2>
                </el-row>
                <el-row type="flex" justify="center">
                  <small>暂无课程信息</small>
                </el-row>
                <el-row type="flex" justify="center">
                  <i class="fa fa-th" aria-hidden="true"></i>
                </el-row>
              </div>
            </el-col>
          </el-row>
        </div>
      </el-col>
    </el-row>
    <el-row>
      <el-col :span="20">
        <div class="index">
          <big>班级管理</big>
        </div>
      </el-col>
    </el-row>
    <el-row v-for="(course,num) in listClass" :key="course.classId">
      <el-col :span="20">
        <div class="index-centent">
          <el-row type="flex" justify="center">
            <el-col :span="1">
              <div class="index-span">
                <span>{{num+1}}</span>
              </div>
            </el-col>
            <el-col :span="7">
              <div>
                <p class="index-span-name">{{course.clazz.name}}</p>
                <p class="index-span-plan">{{course.clazz.grade_name}}</p>
              </div>
            </el-col>
            <el-col :span="7">
              <div></div>
            </el-col>
            <el-col :span="8">
              <div>
                <el-row type="flex" justify="center">
                  <el-col :span="8">
                    <div class="index-centent-i">
                      <i class="fa fa-book" aria-hidden="true"></i>
                    </div>
                    <p class="index-centent-text">去上课</p>
                  </el-col>
                  <el-col :span="8">
                    <div class="index-centent-i">
                      <i class="fa fa-bar-chart" aria-hidden="true"></i>
                    </div>
                    <p class="index-centent-text">班级态势表</p>
                  </el-col>
                  <el-col :span="8">
                    <div class="index-centent-i">
                      <i class="el-icon-picture-outline"></i>
                    </div>
                    <p class="index-centent-text">相册</p>
                  </el-col>
                </el-row>
              </div>
            </el-col>
          </el-row>
          <el-row>
            <el-progress :percentage="course.clazz.rate*100"></el-progress>
          </el-row>
        </div>
      </el-col>
    </el-row>
  </div>
</template>

<script>
import http from '@/utils/HttpUtil'
export default {
  data () {
    return {
      year: '',
      month: '',
      day: '',
      listClass: [],
      Listnum: [],
      numClass: '',
      active: {
        getSelfClass: 'LearningPlatform/manager/class/getSelfClass'
      }
    }
  },
  components: {

  },
  methods: {
    SelfClass () {
      http.xhrGet(this, this.active.getSelfClass, null, (res) => {
        this.listClass = res.data.data.list
        this.numClass = res.data.data.list.length
        var num = ''
        for (let i = 1; i <= this.numClass; i++) {
          num += i
        }
        this.Listnum = num.split('')
      })
    }
  },
  mounted () {
    var now = new Date()
    // 获取当前时间的年份
    this.year = now.getFullYear()
    // 获取当前时间的月份，月份从0开始，所以需要加一
    this.month = now.getMonth() + 1
    // 获取当前时间的日期
    this.day = now.getDate()
    this.SelfClass()
  }
}
</script>

<style scoped="scoped">
 @import url("../assets/css/index.css");
</style>
